import {Component} from 'react';
// 高阶组件本质就是一个函数类比高阶函数(参数是一个函数返回值也是一个函数)，高阶组件参数为一个组件返回值为新的组件
/* 
高阶组件特点：
1. 复用业务逻辑
2. 强化props
3. 渲染劫持
4. 状态复用
*/
function withMouse(NewsComponent){
    class MyComponent extends Component{
        state = {
            x:0,
            y:0
        }
        componentDidMount(){
            document.addEventListener("mousemove",(e)=>{
                this.setState({
                    x:e.pageX,
                    y:e.pageY
                })
            })
        }
        componentWillUnmount(){
            document.removeEventListener("mousemove");
        }
        render(){
            return  <NewsComponent x={this.state.x} y={this.state.y}></NewsComponent>
        }
    }
    return MyComponent
}

export default withMouse;